"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

require("antd/lib/drawer/style/css");

var _drawer = _interopRequireDefault(require("antd/lib/drawer"));

require("antd/lib/switch/style/css");

var _switch = _interopRequireDefault(require("antd/lib/switch"));

require("antd/lib/divider/style/css");

var _divider = _interopRequireDefault(require("antd/lib/divider"));

require("antd/lib/button/style/css");

var _button = _interopRequireDefault(require("antd/lib/button"));

require("antd/lib/tooltip/style/css");

var _tooltip = _interopRequireDefault(require("antd/lib/tooltip"));

var _react = _interopRequireWildcard(require("react"));

var _icons = require("@ant-design/icons");

var _tableIcon = _interopRequireDefault(require("./tableIcon1.png"));

var _tableIcon2 = _interopRequireDefault(require("./tableIcon2.png"));

var _tableIcon3 = _interopRequireDefault(require("./tableIcon3.png"));

var _tableIcon4 = _interopRequireDefault(require("./tableIcon4.png"));

require("./index.less");

var _context2 = _interopRequireDefault(require("../context"));

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }

function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

var LayoutSetting = /*#__PURE__*/function (_PureComponent) {
  _inherits(LayoutSetting, _PureComponent);

  var _super = _createSuper(LayoutSetting);

  function LayoutSetting() {
    var _this;

    _classCallCheck(this, LayoutSetting);

    _this = _super.call(this);

    _this.drawerOnswitch = function () {
      var _assertThisInitialize = _assertThisInitialized(_this),
          state = _assertThisInitialize.state;

      var visible = !!state.visible;

      _this.setState({
        visible: !visible
      });
    };

    _this.drawerOnClose = function () {
      _this.setState({
        visible: false
      });
    };

    _this.onChange = /*#__PURE__*/function () {
      var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(target, code) {
        var updateLayoutSettingState;
        return regeneratorRuntime.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                updateLayoutSettingState = _this.context.updateLayoutSettingState;

                if (!(target === 'primaryColor')) {
                  _context.next = 4;
                  break;
                }

                _context.next = 4;
                return window.less.modifyVars({
                  '@primary-color': code
                }).catch(function (error) {
                  // eslint-disable-next-line
                  console.log(error);
                });

              case 4:
                updateLayoutSettingState(_defineProperty({}, target, code));

              case 5:
              case "end":
                return _context.stop();
            }
          }
        }, _callee);
      }));

      return function (_x, _x2) {
        return _ref.apply(this, arguments);
      };
    }();

    _this.renderRow = function (_ref2) {
      var title = _ref2.title,
          list = _ref2.list,
          code = _ref2.code,
          itemClick = _ref2.itemClick,
          target = _ref2.target,
          render = _ref2.render;
      var primaryColor = _this.context.primaryColor;
      return /*#__PURE__*/_react.default.createElement("div", {
        style: {
          marginBottom: 24
        }
      }, /*#__PURE__*/_react.default.createElement("h3", {
        className: "title"
      }, title), render ? render() : /*#__PURE__*/_react.default.createElement("div", {
        className: "row"
      }, list.map(function (item) {
        return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
          title: item.title,
          key: item.code
        }, /*#__PURE__*/_react.default.createElement("div", {
          className: "styleItem",
          onClick: itemClick.bind(null, target, item.code)
        }, /*#__PURE__*/_react.default.createElement("img", {
          alt: item.title,
          className: "styleItemImg",
          src: item.imgSrc
        }), code === item.code && /*#__PURE__*/_react.default.createElement("div", {
          className: "styleItemIcon"
        }, /*#__PURE__*/_react.default.createElement(_icons.CheckOutlined, {
          style: {
            color: primaryColor
          }
        }))));
      })));
    };

    _this.state = {
      visible: false
    };
    return _this;
  }

  _createClass(LayoutSetting, [{
    key: "render",
    value: function render() {
      var _this2 = this;

      var state = this.state; // const { settings } = this.props;

      var settings = this.context;
      var navTheme = settings.navTheme,
          primaryColor = settings.primaryColor,
          tableLayout = settings.tableLayout,
          layout = settings.layout;
      var navThemeList = [{
        title: '暗色菜单风格',
        code: 'dark',
        imgSrc: 'https://gw.alipayobjects.com/zos/antfincdn/XwFOFbLkSM/LCkqqYNmvBEbokSDscrm.svg'
      }, {
        title: '亮色菜单风格',
        code: 'light',
        imgSrc: 'https://gw.alipayobjects.com/zos/antfincdn/NQ%24zoisaD2/jpRkZQMyYRryryPNtyIC.svg'
      } // {
      //   title: '暗夜风格',
      //   code: 'realDark',
      //   imgSrc: 'https://gw.alipayobjects.com/zos/antfincdn/hmKaLQvmY2/LCkqqYNmvBEbokSDscrm.svg',
      // },
      ];
      var themeColorList = [{
        title: '拂晓蓝（默认）',
        color: 'rgb(24,144,255)'
      }, {
        title: '薄暮',
        color: 'rgb(245,34,45)'
      }, {
        title: '火山',
        color: 'rgb(250,84,28)'
      }, {
        title: '日暮',
        color: 'rgb(250,173,20)'
      }, {
        title: '明青',
        color: 'rgb(19,194,194)'
      }, {
        title: '极光绿',
        color: 'rgb(82,196,26)'
      }, {
        title: '极客蓝',
        color: 'rgb(47,84,235)'
      }, {
        title: '酱紫',
        color: 'rgb(114,46,209)'
      }];
      var siderList = [{
        title: '侧边菜单布局',
        code: 'sidemenu',
        imgSrc: 'https://gw.alipayobjects.com/zos/antfincdn/XwFOFbLkSM/LCkqqYNmvBEbokSDscrm.svg'
      }, {
        title: '顶部菜单布局',
        code: 'topmenu',
        imgSrc: 'https://gw.alipayobjects.com/zos/antfincdn/URETY8%24STp/KDNDBbriJhLwuqMoxcAr.svg'
      }];
      var tableList = [{
        title: '普通表格',
        code: 'normal',
        imgSrc: _tableIcon.default
      }, {
        title: '斑马纹模式',
        code: 'zebra',
        imgSrc: _tableIcon2.default
      }, {
        title: '竖线模式',
        code: 'verticalLine',
        imgSrc: _tableIcon3.default
      }, {
        title: '斑马纹+竖线',
        code: 'zebraVerticalLine',
        imgSrc: _tableIcon4.default
      }];
      return /*#__PURE__*/_react.default.createElement(_drawer.default, {
        placement: "right",
        closable: true,
        width: 300,
        onClose: this.drawerOnClose,
        visible: state.visible,
        handler: /*#__PURE__*/_react.default.createElement(_button.default, {
          className: "xuanyue-Drawer-switchBtn",
          style: {
            borderRadius: '4px 0 0 4px'
          },
          type: "primary",
          icon: state.visible ? /*#__PURE__*/_react.default.createElement(_icons.CloseOutlined, {
            style: {
              color: '#fff',
              fontSize: 20
            }
          }) : /*#__PURE__*/_react.default.createElement(_icons.SettingOutlined, {
            style: {
              color: '#fff',
              fontSize: 20
            }
          }),
          onClick: this.drawerOnswitch
        })
      }, /*#__PURE__*/_react.default.createElement("div", {
        className: "xuanyue-Drawer"
      }, this.renderRow({
        title: '整体风格设置',
        list: navThemeList,
        code: navTheme,
        itemClick: this.onChange,
        target: 'navTheme'
      }), /*#__PURE__*/_react.default.createElement(_divider.default, null), /*#__PURE__*/_react.default.createElement("div", {
        style: {
          marginBottom: 24
        }
      }, /*#__PURE__*/_react.default.createElement("h3", {
        style: {
          fontSize: 14,
          margin: 0,
          paddingBottom: 16
        }
      }, "\u4E3B\u9898\u8272"), /*#__PURE__*/_react.default.createElement("div", {
        className: "row"
      }, themeColorList.map(function (item) {
        return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
          key: item.color,
          title: item.title
        }, /*#__PURE__*/_react.default.createElement("div", {
          className: "colorItem",
          style: {
            background: "".concat(item.color)
          },
          onClick: _this2.onChange.bind(_this2, 'primaryColor', item.color)
        }, primaryColor === item.color && /*#__PURE__*/_react.default.createElement("div", {
          className: "styleItemIcon",
          style: {
            width: 20,
            height: 20
          }
        }, /*#__PURE__*/_react.default.createElement(_icons.CheckOutlined, {
          style: {
            color: '#fff'
          }
        }))));
      }))), /*#__PURE__*/_react.default.createElement(_divider.default, null), this.renderRow({
        title: '导航模式',
        list: siderList,
        code: layout,
        itemClick: this.onChange,
        target: 'layout'
      }), /*#__PURE__*/_react.default.createElement(_divider.default, null), this.renderRow({
        title: '表格模式',
        list: tableList,
        code: tableLayout,
        itemClick: this.onChange,
        target: 'tableLayout'
      }), /*#__PURE__*/_react.default.createElement(_divider.default, null), this.renderRow({
        title: '表格模式',
        render: function render() {
          return /*#__PURE__*/_react.default.createElement("div", {
            style: {
              display: 'flex',
              justifyContent: 'space-between'
            }
          }, /*#__PURE__*/_react.default.createElement("div", null, "\u591A\u5DE5\u4F5C\u53F0"), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_switch.default, {
            size: "small",
            onChange: function onChange(e) {
              _this2.onChange('mutilModel', e);
            },
            checked: settings.mutilModel
          })));
        }
      })));
    }
  }]);

  return LayoutSetting;
}(_react.PureComponent); // 和settingProvider.js 相呼应


LayoutSetting.contextType = _context2.default;
var _default = LayoutSetting;
exports.default = _default;